<template>
	<view>
		<!-- 头部背景及标题 -->
		<view class="head">
			<image src="../../static/me/bg1.png" class="head_img" style="width: 100%;height: 326rpx;"></image>
		</view>
		<!-- 信息头像 -->
		<view class="me_info">
			<image src="../../static/me/bg2.png" style="width: 708rpx;height: 340rpx;"></image>
			<image v-if="indexInfoData.memberinfo && indexInfoData.memberinfo.avatar"
				:src="indexInfoData.memberinfo.avatar" class="userHeader"></image>
			<view class="me_info_firm">
				{{my_info.firm}}
			</view>
			<view class="me_info_name">
				{{indexInfoData.memberinfo.nickname}}
			</view>
			<view class="me_info_bumen" v-if="indexInfoData.department_name">
				{{indexInfoData.department_name}}
			</view>
			<view class="me_info_position">
				{{callsTitle}}
			</view>
			<view class="me_info_motto">
				{{indexInfoData.memberinfo.motto == null || indexInfoData.memberinfo.motto == ''?'Have a nice day!':indexInfoData.memberinfo.motto}}
			</view>
		</view>
		<!-- 更改信息条目 -->
		<view class="me_change">
			<view class="me_change_item" v-for="item in change_item" @click="clickItem(item)">
				<image :src="item.src1" style="width: 33rpx;height: 33rpx;position: absolute;top: 30rpx;"></image>
				<text style="margin-left: 60rpx;">{{item.text}}</text>
				<image src="../../static/me/jaintou.png"
					style="width: 18rpx; height: 34rpx;position: absolute;top: 30rpx;right: 30rpx;"></image>
			</view>
		</view>

		<!-- APP端展示隐私政策 -->
		<!-- #ifdef APP-PLUS -->
		<view class="private_service" @click="showPrivateService()">
			<text style="border-bottom: 1rpx solid #40A0F2;">隐私政策</text>
		</view>
		<!-- #endif -->

	</view>
</template>

<script>
	export default {
		data() {
			return {
				wxcode: '',
				token: '',
				member_id: '',
				company_id: '',
				company_name: '',
				avatarUrl: '',
				indexInfoData: {
					memberinfo: {
						nickname: ''
					}
				},
				callsTitle: '',
				my_info: {
					firm: '河南邦泰合力管理咨询有限公司',
					name: '',
					bumen: '',
					position: '',
					motto: ''

				},

				change_item: [{
						id: 0,
						src1: '../../static/me/xiugai.png',
						text: '修改个人信息',
						url: 'alterUserInfo'
					},
					{
						id: 1,
						src1: '../../static/me/anquan.png',
						text: '账号安全',
						url: 'accountSecurity'
					},
					{
						id: 2,
						src1: '../../static/me/qiye.png',
						text: '修改企业信息',
						url: 'alterFirmInfo'
					},
					{
						id: 3,
						src1: '../../static/me/mima.png',
						text: '修改密码',
						url: 'alterPassword'
					},
					{
						id: 7,
						src1: '../../static/me/zidongshenpi.png',
						text: '自动审批数据库',
						url: '/pakageMessage/pages/message/autoSql'
					},
					// #ifdef MP-WEIXIN
					{
						id: 4,
						src1: '../../static/me/wx.png',
						text: '绑定微信',
						url: ''
					},
					// #endif

					{
						id: 5,
						src1: '../../static/me/qiehuan.png',
						text: '切换企业',
						url: '/pages/index/firm/firm'
					},
					{
						id: 6,
						src1: '../../static/me/tuichu.png',
						text: '退出登录',
						url: ''
					}
				],


			}
		},
		onShow() {
			this.token = uni.getStorageSync('btlh_process_token') || ''
			this.member_id = uni.getStorageSync('btlh_process_member_id') || ''
			this.company_id = uni.getStorageSync('bthl_process_LoginCompanyId') || ''
			this.company_name = uni.getStorageSync('bthl_process_LoginCompanyName') || ''
			this.getIndexInfo()

		},
		async onLoad() {
			this.token = uni.getStorageSync('btlh_process_token') || ''
			this.member_id = uni.getStorageSync('btlh_process_member_id') || ''
			this.company_id = uni.getStorageSync('bthl_process_LoginCompanyId') || ''
			this.company_name = uni.getStorageSync('bthl_process_LoginCompanyName') || ''
			this.getIndexInfo()


		},

		methods: {
			// 查看隐私政策
			showPrivateService() {
				uni.navigateTo({
					url: '../know/webVIew?src=https://control.sxpz.vip/agreement.html'
				})
			},
			// 获取首页信息
			async getIndexInfo() {
				const {
					data: res
				} = await this.$myRequest({
					url: 'Index/overview',
					method: 'POST',
					data: {
						member_id: this.member_id,
						token: this.token,
						company_id: this.company_id,

					},

				})
				if (res.code != 200) return uni.showToast({
					title: res.datas.msg,
					icon: 'none'
				})
				this.indexInfoData = res.datas
				this.avatarUrl = res.datas.memberinfo.avatar
				if (this.indexInfoData.call.length > 0) {
					this.callsTitle = this.indexInfoData.call.join('/')
				}
				if (this.indexInfoData.memberinfo) {
					// 账号
					uni.setStorage({
						key: 'btlh_process_usernameForIndex',
						data: this.indexInfoData.memberinfo.username
					})
					// 头像
					uni.setStorage({
						key: 'btlh_process_avatarUrl',
						data: this.indexInfoData.memberinfo.avatar
					})
					// 用户昵称
					uni.setStorage({
						key: 'btlh_process_nickname',
						data: this.indexInfoData.memberinfo.nickname
					})
				}

				console.log('首页信息', this.indexInfoData)

			},
			/* 
			点击修改条目 
			 */
			async clickItem(item) {

				// 绑定微信
				if (item.id === 4) {
					uni.navigateTo({
						url: '/pakageMessage/pages/message/wxBing'
					})

				}
				// 退出登录
				if (item.id == '6') {
					const {
						data: res
					} = await this.$myRequest({
						url: 'Public/login_out',
						method: 'POST',
						data: {},
					})
					if (res.code != 200) return uni.showToast({
						title: res.datas.msg,
						icon: 'none'
					})

					uni.clearStorageSync();
					return uni.reLaunch({
						url: `/pages/index/index`
					})
				}
				// 进入其他页面
				uni.navigateTo({
					url: item.url
				})
			}
		}
	}
</script>

<style lang="scss">
	.private_service {
		width: 100%;
		height: 50rpx;
		text-align: center;
		color: #40A0F2;
		font-size: 28rpx;
		margin-top: 180rpx;
	}

	.me_change {
		width: 690rpx;
		height: 643rpx;
		margin-left: 30rpx;
		margin-top: 270rpx;
		border-top: 1px solid #EFEFEF;

		.me_change_item {
			width: 100%;
			height: 91rpx;
			border-bottom: 1rpx solid #EFEFEF;
			font-size: 28rpx;
			font-family: PingFang SC;
			font-weight: 500;
			color: #333333;
			line-height: 91rpx;
			position: relative;
		}
	}

	.me_info {
		width: 708rpx;
		height: 340rpx;
		position: absolute;
		top: 200rpx;
		left: 21rpx;

		.userHeader {
			width: 120rpx;
			height: 120rpx;
			border-radius: 55rpx;
			position: absolute;
			top: 106rpx;
			left: 53rpx;

		}

		.me_info_firm {
			width: 100%;
			font-size: 32rpx;
			font-family: PingFang SC;
			font-weight: 500;
			color: #FFFFFF;
			position: absolute;
			top: 35rpx;
			text-align: center;
		}

		.me_info_name {
			font-size: 30rpx;
			font-family: PingFang SC;
			font-weight: bold;
			color: #FFFFFF;
			position: absolute;
			top: 126rpx;
			left: 199rpx;
		}

		.me_info_bumen {
			font-size: 24rpx;
			font-family: PingFang SC;
			font-weight: 500;
			color: #FFFFFF;
			position: absolute;
			top: 181rpx;
			left: 200rpx;
		}

		.me_info_position {
			font-size: 24rpx;
			font-family: PingFang SC;
			font-weight: 500;
			color: #FFFFFF;
			position: absolute;
			top: 181rpx;
			left: 300rpx;
		}

		.me_info_motto {
			font-size: 24rpx;
			font-family: PingFang SC;
			font-weight: 500;
			color: #FFFFFF;
			position: absolute;
			top: 256rpx;
			left: 300rpx;
			width: 372rpx;
			overflow: hidden;
			/*超出部分隐藏*/
			white-space: nowrap;
			/*不换行*/
			text-overflow: ellipsis;
			/*超出部分文字以...显示*/
		}
	}

	.head {
		width: 100%;
		height: 326rpx;

		.head_text {
			font-size: 36rpx;
			font-family: PingFang SC;
			font-weight: bold;
			color: #FFFFFF;
			position: absolute;
			top: 63rpx;
			left: 340rpx;
		}
	}
</style>
